<script setup lang="ts">
import { ref, onMounted } from 'vue'
import request from "../utils/axios.ts"
import qs from 'qs';
import UserCardListByTags from "../components/UserCardListByTags.vue";
import { useRoute } from 'vue-router';

const userList = ref([])
const route = useRoute()
const { tags } = route.query

onMounted(async () => {
    const res = await request.get('/user/search/tags', {
        params: {
            tagNameList: tags
        },
        paramsSerializer: params => {
            return qs.stringify(params, { indices: false })
        }
    })

    if (res.data) {
        res.data.forEach(user => {
            user.tags = JSON.parse(user.tags)
        });
    }

    userList.value = res.data
})
</script>
<template>
    <user-card-list-by-tags :user-list="userList" v-if="userList.length > 0" title="搜索结果"/>
    <van-empty v-show="!userList || userList.length < 1" description="暂无符合要求的用户" v-else />

</template>

<style scoped lang='scss'></style>